<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<h:head>
	<title>Add Customer</title>
</h:head>
<f:view>
	<h:body>
		<ui:composition template="../includes/template.xhtml">
			<ui:define name="mainbody">
				<p:growl id="growl" showDetail="true" sticky="false"
					autoUpdate="true" showSummary="false" />
				<center>

					<h:form>

						<p:panel header="Add Customer" style="min-height: 550px"
							styleClass="prime_panel">

							<center>

								<table border="0" cellpadding="4px" cellspacing="8px">
									<tr>
										<p:spacer height="20" />
									</tr>
									<tr>
										<td><h:outputText value="School Name :" />
											<h:outputText value="*" style="color:red" />
										</td>
										<td><p:tooltip for="schoolName" showEvent="focus"
												hideEvent="blur" showEffect="clip" hideEffect="explode" />
											<p:inputText id="schoolName" size="20" required="true"
												value="#{customerBean.school.schoolName}"
												title="Minimum Length is 10 character"
												requiredMessage="Minimum Length Of School Name will be 10">
												<f:validateLength minimum="10" />
												<f:ajax execute="@this" event="blur" />
											</p:inputText></td>


										<td><h:outputText value="Short Name :" />
											<h:outputText value="*" style="color:red" />
										</td>
										<td><p:inputText id="shortName" size="20" required="true"
												requiredMessage="Please enter the Short Name"
												value="#{customerBean.school.shortName}">
												<f:ajax execute="@this" event="blur" />
											</p:inputText></td>
									</tr>

									<tr>
										<td><h:outputText value="Principal Name :" />
											<h:outputText value="*" style="color:red" />
										</td>
										<td><p:inputText id="principalName" size="20"
												required="true"
												requiredMessage="Please Enter Principal Name"
												value="#{customerBean.school.headName}">
												<f:ajax execute="@this" event="blur" />
											</p:inputText></td>
										<td><h:outputText value="School Website :" />
										</td>
										<td><p:tooltip for="schoolWebsite" showEvent="focus"
												hideEvent="blur" showEffect="clip" hideEffect="explode" />
											<p:inputText size="20" id="schoolWebsite"
												value="#{customerBean.school.website}" title="Optional" />

										</td>


									</tr>



									<tr>
										<td><h:outputText value="Expiry Date :" />
											<h:outputText value="*" style="color:red" />
										</td>
										<td><p:calendar mode="popup" size="20" navigator="true"
												pattern="dd-MM-yyyy" effect="fadeIn" showButtonPanel="true"
												value="#{customerBean.school.expiryDate}"
												readOnlyInputText="true" required="true"
												requiredMessage="Please Enter the Expiry Date">
												<f:ajax execute="@this" event="blur" />
											</p:calendar>
										</td>


										<td><h:outputText value="Address :" />
											<h:outputText value="*" style="color:red" />
										</td>
										<td><p:inputText size="20" id="address" required="true"
												requiredMessage="Please Enter Address"
												value="#{customerBean.school.address}">
												<f:ajax execute="@this" event="blur" />
											</p:inputText></td>

									</tr>



									<tr>
										<td><h:outputText value="Fax Number:" />
										</td>
										<td><p:tooltip for="fax" showEvent="focus"
												hideEvent="blur" /> <p:inputMask size="20" id="fax"
												mask="+99-9999999999"
												value="#{customerBean.school.faxNumber}" title="Optional" />
										</td>



										<td><h:outputText value="Ph. Number :" />
											<h:outputText value="*" style="color:red" />
										</td>
										<td><p:inputMask id="ph" mask="+99-9999999999" size="20"
												value="#{customerBean.school.phoneNumber}" required="true"
												requiredMessage="Please Enter the Phone Number">
												<f:ajax execute="@this" event="blur" />
											</p:inputMask></td>
									</tr>



									<tr>
										<td></td>
										<td></td>
										<td><h:outputText value="Description :" />
										</td>
										<td><p:tooltip for="desc" showEvent="focus"
												hideEvent="blur" /> <p:inputTextarea size="20" id="desc"
												rows="5" cols="20"
												value="#{customerBean.school.description}" title="Optional" />
										</td>
									</tr>





									<tr>
										<td></td>
										<td></td>
										<td></td>
										<td style="text-align: right"><p:commandButton
												id="submit" ajax="false" value="Submit" type="submit"
												update="growl" action="#{customerBean.action}" />
										</td>
									</tr>
								</table>
							</center>
						</p:panel>
					</h:form>
				</center>
			</ui:define>
		</ui:composition>
	</h:body>
</f:view>
</html>
